<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@ taglib uri="http://myfaces.apache.org/tomahawk" prefix="t"%>
<%@ taglib uri="http://richfaces.org/a4j" prefix="a4j"%>
<%@ taglib uri="http://richfaces.org/rich" prefix="rich"%>
<rich:panel header="#{messages['confirm.payment']}">
	<h:panelGrid>
		<h:outputText value="#{errorBean.errorMessage}" styleClass="error"></h:outputText>
	</h:panelGrid>
	<t:panelGrid columns="2"
		columnClasses="standardTable_ColumnLeft_20,standardTable_ColumnLeft_80"
		width="100%">


		<h:outputLabel for="product" value="#{messages['invoice.no']}"
			styleClass="standardText_Label" />
		<h:outputText id="product" value="#{memberInovicePaymentBean.invoice.invoiceNo}"></h:outputText>

		<h:outputLabel for="amount" value="#{messages['amount']}"
			styleClass="standardText_Label" />
		<h:outputText id="amount" value="#{memberInovicePaymentBean.invoice.invoiceAmount}">
			<f:convertNumber pattern="#,###,###,##0.00" />
		</h:outputText>

		<h:outputText></h:outputText>
		<t:message for="name" styleClass="error"></t:message>
		<h:panelGroup>
			<h:outputText value="*" styleClass="standardText_Mandatory" />
			<h:outputLabel for="name"
				value="#{messages['credit.card.holder.name']}"
				styleClass="standardText_Label" />
		</h:panelGroup>
		<h:inputText id="name" required="true"
			value="#{memberInovicePaymentBean.name}"></h:inputText>
		<h:panelGroup>
			<h:outputText value="*" styleClass="standardText_Mandatory" />
			<h:outputLabel value="#{messages['credit.card.no']}"
				styleClass="standardText_Label" />
		</h:panelGroup>
		<h:panelGroup>
			<t:panelGrid columns="4">
				<t:message for="no1" styleClass="error"></t:message>
				<t:message for="no2" styleClass="error"></t:message>
				<t:message for="no3" styleClass="error"></t:message>
				<t:message for="no4" styleClass="error"></t:message>

				<h:inputText id="no1" maxlength="4" size="4" required="true"
					value="#{memberInovicePaymentBean.cardNo1}"></h:inputText>
				<h:inputText id="no2" maxlength="4" size="4" required="true"
					value="#{memberInovicePaymentBean.cardNo2}"></h:inputText>
				<h:inputText id="no3" maxlength="4" size="4" required="true"
					value="#{memberInovicePaymentBean.cardNo3}"></h:inputText>
				<h:inputText id="no4" maxlength="4" size="4" required="true"
					value="#{memberInovicePaymentBean.cardNo4}"></h:inputText>
			</t:panelGrid>
		</h:panelGroup>

		<h:outputText></h:outputText>
		<t:message for="cvc" styleClass="error"></t:message>

		<h:panelGroup>
			<h:outputText value="*" styleClass="standardText_Mandatory" />
			<h:outputLabel for="cvc" value="#{messages['credit.card.cvc']}"
				styleClass="standardText_Label" />
		</h:panelGroup>
		<h:inputText id="cvc" required="true"
			value="#{memberInovicePaymentBean.cvcNo}"></h:inputText>

		<h:outputText></h:outputText>
		<t:message for="type" styleClass="error"></t:message>

		<h:panelGroup>
			<h:outputText value="*" styleClass="standardText_Mandatory" />
			<h:outputLabel for="type" value="#{messages['credit.card.type']}"
				styleClass="standardText_Label" />
		</h:panelGroup>
		<h:inputText id="type" required="true"
			value="#{memberInovicePaymentBean.cardType}"></h:inputText>

		<h:outputText></h:outputText>
		<t:message for="effectivedate" styleClass="error"></t:message>

		<h:panelGroup>
			<h:outputText value="*" styleClass="standardText_Mandatory" />
			<h:outputLabel for="effectivedate" value="#{messages['expiry.date']}"
				styleClass="standardText_Label" />
		</h:panelGroup>
		<h:panelGroup>
			<t:inputCalendar id="effectivedate"
				monthYearRowClass="yearMonthHeader" weekRowClass="weekHeader"
				currentDayCellClass="currentDayCell"
				value="#{memberInovicePaymentBean.expDate}" renderAsPopup="true"
				popupTodayString="#{messages['popup.today']}"
				popupWeekString="#{messages['popup.week']}"
				popupDateFormat="dd/MM/yyyy" renderPopupButtonAsImage="true"
				styleClass="standardText" required="true">
			</t:inputCalendar>
		</h:panelGroup>

	</t:panelGrid>

	<rich:spacer height="30"></rich:spacer>
	<t:panelGrid columns="2">
		<t:commandButton styleClass="button"
			action="#{memberInovicePaymentBean.confirmPaymentAction}"
			value="#{messages['confirm']}"></t:commandButton>
		<t:commandButton styleClass="button" action="#{memberAgreementMgmtBean.navListAction}"
			value="#{messages['cancel']}" immediate="true"></t:commandButton>
	</t:panelGrid>
</rich:panel>

